﻿@{
    var setting = Pageparkproject.Models.Stories.GetPageSetting();
}
<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>@ViewBag.Title</title>
    <link href="~/Contents/Themes/Style.css" rel="stylesheet" />
    <script src="~/Contents/Scripts/jquery-1.8.2.js"></script>
        <style>
            body{
                background:@ViewBag.bgColor;
            }
            #mainnav li a, #subnav li a{
                color: @ViewBag.navColor;
            }
            #mainnav li.active a {
                color: @ViewBag.navColorActive;
            }
            #mainnav li a:hover, #subnav li a:hover{
                color: @ViewBag.navColorHover;
            }
        </style>
    
</head>
<body>
    <div id="wrapper">
        <div id="nav" style="background:@ViewBag.bgNav">
            <a class="logo" href="@Url.Action("Index", "Home")">@setting.sWebName
            </a>
            <div class="nav-content">
                <script type="text/javascript">
                    $(document).ready(function () {
                        try{
                            $('.@ViewBag.Active').addClass('active');
                        }
                        catch (e){}
                    })
                </script>
                <ul id="mainnav" class="nav clearfix">
                    <li class="Architecture">
                        <a href="@Url.Action("Index", "Architecture")">Architecture</a>
                    </li>
                    <li class="Projects">
                        <a href="@Url.Action("Index", "Project")">Projects</a>
                    </li>
                    <li class="News">
                        <a href="@Url.Action("Index","News")">News</a>
                    </li>
                    <li class="Contact">
                        <a href="@Url.Action("Index","Contact")">Contact</a>
                    </li>
                </ul>
                <ul id="subnav" class="projects_grid nav">
                    @{
                        try
                        {
                            if (ViewBag.routerValue == null)
                            {
                                Html.RenderAction("SubNav", ViewBag.controllerName as string);
                            }
                            else
                            {
                                Html.RenderAction("SubNav", ViewBag.controllerName as string, new { routerValue = ViewBag.routerValue });
                            }
                        }
                        catch { }
                    }
                </ul>
            </div>
            
        </div>
        @*--------------------FILTER------------------------*@

        @RenderSection("Filter", false)

        @*--------------------END FILTER------------------------*@
        <div id="content" class="@ViewBag.cl">
            @RenderBody()

            <div class="credit">
                <div class="credit-btn">
                    <svg version="1.1" x="0px" y="0px" viewBox="0 0 35 35" enable-background="new 0 0 35 35">
                        <polygon fill="#FFFFFF" points="0,35 35,0 35,35 "></polygon>
                    </svg>
                </div>
                <script type="text/javascript">
                    function openfilter() {
                        if ($('#filter').hasClass('filter-closed')) {
                            $('#filter').stop(true, true).slideDown().removeClass('filter-closed').addClass('filter-opened');
                        } else {
                            $('#filter').stop(true, true).slideUp().removeClass('filter-opened').addClass('filter-closed');
                        }
                    }
                    $(document).ready(function () {
                        $('.credit-btn').click(function () {
                            $('.credit-content').stop(true, true).animate({ 'height': '106px' });
                        })
                        $('.credit-close-btn').click(function () {
                            $('.credit-content').stop(true, true).animate({ 'height': '0px' });
                        })
                    })
                </script>

                <div class="credit-content">
                    <span class="credit-close-btn">×</span>
                    <ul class="main-credit">
                        <li>
                            <h1>Design & Development</h1>
                            <ul>
                                <li><a href="http://bergstudio.co.uk" target="_blank">BERG</a> in collaboration
                                    <br>
                                    with <a href="http://effektivedesign.co.uk" target="_blank>">Effektive</a> &amp; <a href="http://liamr.com" target="_blank">Liam R</a></li>
                            </ul>
                        </li>
                        <li>
                            <h1>Content</h1>
                            <ul>
                                @Html.Raw(setting.sContentFooter)
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
     <script type="text/javascript">
         function changeRes() {
             if ($(window).width() < 930) {
                 $('#link-home').text('P\\P');
             } else {
                 $('#link-home').text('PAGE\\PARK');
             }
             
             
             
             if ($(window).width()<= 450) {
                 $('.item').css({ "width": "100%" });
             }else
             if ($(window).width() <= 800) {
                 $('.item').css({ "width": "50%" });
             } else
             if ($(window).width() <= 1200) {
                 $('.item').css({ "width": "25%" });
             }else
             if ($(window).width() <= 1600) {
                 $('.item').css({ "width": "20%" });
             }else
                if ($(window).width() <= 2000) {
                    $('.item').css({ "width": "16.6%" });
                } else
                    if ($(window).width() <= 2000) {
                        $('.item').css({ "width": "16.6%" });
                    } else
                        if ($(window).width() <= 2400) {
                            $('.item').css({ "width": "14.2%" });
                        } else
                            if ($(window).width() <= 2600) {
                                $('.item').css({ "width": "12.5%" });
                            } else
                                if ($(window).width() > 2600) {
                                    $('.item').css({ "width": "10%" });
                                }

         }
         $(document).ready(function () {
             $(window).resize(function () {
                 changeRes();
             })
             $(window).load(function () {
                 changeRes();
             })
         })
        </script>
</body>
</html>
